<template>
    <div v-bind:style="{'background-color':PublicKeyCredential,width:innerWidth,height:height+'px'}"></div>

    <div v-bind:style="{backgroundColor: isBlue ? blue :'black', width:'50px', height:'20px'}"></div>

    <div v-bind:style="myDiv"></div>
</template>

<script setup>
import {ref,reactive} from 'vue'
const isBlue=ref(false);
const blue=ref('blue')
const pink=ref('pink')
const width=ref('100%')
const height=ref(40)
const myDiv=reactive({
    backgroundColor: 'red',
    width:'50px',
    height:'20px'
})
</script>